<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>具名插槽</title>
		<script src="../vue@3.2.23.js"></script>
	</head>
	<body>
		<div id="app">
			
			<box>
				<template #header>
					header
				</template>
				<template v-slot:footer>
					footer
				</template>
			</box>
		</div>
	</body>
</html>
<script>
	
	const app=Vue.createApp({
		data() {
			return{
				
			}
		}
	})
	app.component('box',{
		template:`
			<slot name="header"></slot>
			<div>center</div>
			<slot name="footer"></slot>
		`
	})
	const vm=app.mount('#app')
</script>